page {
    height: 100%;
}

.login {
    width: 100%;
    height: 100%;
    position: relative;
    background-image: url(https://hrwelcome.sigs.mtts.cc/static/fresh/login/loginBackground.png);
    background-size: 100% 100%;

    .logo {
        width: 400rpx;
        height: 71rpx;
        position: absolute;
        top: 30rpx;
        left: 32rpx;
        background-image: url(../../static/login/logo.png);
        background-size: 90% 90%;
        background-repeat: no-repeat;
    }

    .content {
        width: 630rpx;
        height: 730rpx;
        background-color: #fff;
        position: absolute;
        left: 60rpx;
        top: 290rpx;
        border-radius: 10rpx;

        .contentText {
            padding-top: 60rpx;
            text-align: center;

            text {
                font-size: 60rpx;
                font-family: 'pingFangSC-Medium';
            }
        }

        .studentLabel,
        .teacherLabel {
            position: absolute;
            left: 0;
            top: 164rpx;
            width: 100%;
            height: 75rpx;

            background-size: 100% 100%;
            display: flex;
            justify-content: center;
            font-size: 28rpx;

            .student,
            .teacher {
                width: 150rpx;
                line-height: 75rpx;
            }

        }

        .studentLabel {
            background-image: url(../../static/login/studentLabel.png);
            text-align: center;

            .student {
                color: #fff;
                // margin-left: 36rpx;
                // margin-right: 20rpx;
                background: #418cff;
                width: 254rpx;
                font-size: 32rpx;
            }

            .teacher {
                color: #686869;
                width: 254rpx;
                background: #ecf0fc;
            }
        }

        .teacherLabel {
            background-image: url(../../static/login/teacherLabel.png);
            text-align: center;

            .teacher {
                color: #fff;
                // margin-left: 0;
                // margin-right: 0;
                background: #418cff;
                width: 254rpx;
                font-size: 32rpx;
            }

            .student {
                // margin-left: 25rpx;
                // margin-right: 10rpx;
                color: #686869;
                width: 254rpx;
                background: #ecf0fc;
            }
        }

        .form {
            width: 84%;
            padding: 20rpx 50rpx;
            margin-top: 72rpx;

            .hint {
                padding: 15rpx 0;
                text-align: right;
                color: #cacacb;
                font-size: 28rpx;
            }

            .studentNumber,
            .username,
            .IDNumber {
                display: flex;
                border-bottom: 1px solid #f1eeee;
                padding: 20rpx 0;
                margin-top: 20rpx;
                // border: 2rpx solid #c8c8c8;
                padding-left: 20rpx;
                box-sizing: border-box;

                .input-placeholder {
                    color: #cacacb;
                    font-size: 30rpx;
                }

                .studentNumberIcon,
                .usernameIcon,
                .IDNumberIcon {
                    width: 150rpx;
                    height: 36rpx;
                    margin-top: 3rpx;

                }

                .accountIcon,
                .passwordIcon {
                    width: 36rpx;
                    height: 36rpx;
                    background-size: 100% 100%;
                    margin-right: 30rpx;
                    margin-top: 3rpx;
                }

                .accountIcon {
                    background-image: url(../../static/login/studentNumber.png);
                }

                .passwordIcon {
                    background-image: url(../../static/login/password.png);
                }
            }
        }

        .btn {
            position: absolute;
            left: 0;
            right: 0;
            bottom: 46rpx;
            display: flex;
            justify-content: center;

            // background-color: #418cff;
            button {
                width: 85%;
                height: 80rpx;
                background-color: #418cff;
                color: #fff;
                line-height: 80rpx;
            }

        }
    }
}